<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
  <title>web前端工程师——钟宝琴的简历</title>
  <style type="text/css">
    * {
      margin: 0;
      box-sizing: border-box;
      -webkit-overflow-scrolling: touch;
      -webkit-appearance: none;
    }
    html {
      font-family: PingFang-Medium, PingFangSC-Regular, Helvetica;
      -ms-text-size-adjust: 100%;
      -webkit-text-size-adjust: 100%;
      font-size: 62.5%
    }
    body {
      background: #F2F2F5;
      line-height: 26px;
      color: #414a60;
      font-size: 16px;
      margin:0;
      font-family: arial,verdana,helvetica,'PingFang SC','HanHei SC',STHeitiSC-Light,Microsoft Yahei,sans-serif;
      -webkit-font-smoothing: antialiased;
    }
    a, b, button, dd, div, dl, em, footer, form, h1, h2, h3, h4, h5, h6, i, input, label, li, nav, p, select, span, td, textarea, u, ul {
      padding: 0;
      padding-top: 0px;
      padding-right: 0px;
      padding-bottom: 0px;
      padding-left: 0px;
      margin: 0;
      -webkit-tap-highlight-color: transparent;
    }
    .resume-box{
      padding: .15rem;
      background-color: #fff;
      -webkit-box-shadow:0 0 .2rem rgba(0, 0, 0, .1);
      -moz-box-shadow:0 0 .2rem rgba(0, 0, 0, .1);
      box-shadow:0 0 .2rem rgba(0, 0, 0, .1);
    }
    .fz-resume{
      width: .14rem;
      height: .14rem;
      display: inline-block;
      vertical-align: middle;
      background-repeat: no-repeat;
      background-position: center center;
      background-size: 100%;
      margin-right: .1rem;
    }
    /*图标*/
    .fz-female {
      background-image: url('');
    }
    .fz-degree{
      background-image: url('');
    }
    .fz-experience {
      background-image:url('');
    }
    .fz-status{
      background-image:url('');
    }
    .fz-tel{
      background-image: url('');
    }
    .fz-email{
      background-image: url('');
    }
    .fz-job{
      background-image: url('');
    }
    .fz-salary{
      background-image: url('');
    }
    .fz-industry{
      background-image: url('');
    }
    .fz-place{
      background-image: url('');
    }

    .resume-item .name {
      font-weight: 400;
      font-size: .24rem;
      margin-bottom: .1rem;
    }
    .resume-item .title {
      border-bottom: 1px #F2F3F3 solid;
      font-size: .18rem;
      padding: .1rem 0 .04rem;
      font-weight: 400;
      color: #333;
      margin-bottom: .1rem;
    }
    .info-labels{
      padding-bottom: .06rem;
    }
    .resume-item .text {
      color: #9fa3b0;
      line-height: 1.8;
      word-break: break-all;
      word-wrap: break-word;
      margin-top: .1rem;
    }
    .resume-item .text p {
      line-height: 1.8;
      font-size: .14rem;
      color: #999;
    }
    .resume-item .text h4 {
      font-size: .16rem;
      font-weight: 400;
      color: #414a60;
    }
    .resume-item .text h4 span {
      font-size: .14rem;
      color: #9fa3b0;
      padding: .02rem .14rem;
      border: 1px solid #cfd1d7;
      border-radius: 50px;
      margin-right: .1rem;
    }
    .resume-item .period {
      float: right;
      color: #9fa3b0;
      font-size: .14rem;
    }

    .info-labels .label-text {
      display: inline-block;
      vertical-align: middle;
      font-size: .14rem;
    }
    .vline {
      display: inline-block;
      width: 1px;
      height: .1rem;
      vertical-align: middle;
      background: #E0E0E0;
      margin: 0 10px;
    }
    .resume-item .info-labels .vline {
      margin: 0 .1rem;
    }
    .history-education, .history-project {
      position: relative;
      padding-left: .3rem;
      overflow: hidden;
    }
    .history-company, .history-education, .history-project {
      padding-top: .1rem;
    }
    .history-education:before, .history-project:before {
      content: '';
      display: block;
      position: absolute;
      border-left: 1px #eee dashed;
      width: 0;
      top: 30px;
      left: 10px;
      bottom: 36px;
    }
    .history-education h4.name, 
    .history-project h4.name {
      font-size: .16rem;
      font-weight: 400;
      position: relative;
      display: inline-block;
    }
    .history-education h4.name:before,
    .history-project h4.name:before {
      content: '';
      position: absolute;
      width: .1rem;
      height: .1rem;
      background: #fff;
      border: 1px #18c3b1 solid;
      border-radius: 100%;
      top: .06rem;
      left: -.25rem;
    }
    .history-item {
      padding-bottom: .15rem;
      position: relative;
    }
    .history-item .text h4 {
      position: relative;
    }
    .history-item .text h4:before {
      content: '';
      position: absolute;
      width: .08rem;
      height: .08rem;
      background: #ddd;
      border-radius: 100%;
      top: .1rem;
      left: -.23rem;
    }
    html {
      font-size: 100px
    }
    
    @media screen and (max-width:360px) {
      html {
        font-size: 90px;
        line-height: 90px
      }
    }
    
    body {
      overflow-x: hidden;
      min-width: 320px;
      -webkit-overflow-scrolling: touch;
      font-size: .12rem
    }
  </style>
</head>
<body>
<div class="resume-box">
  <!--个人基本信息-->
  <div class="resume-item resume-userinfo">
    <h2 class="name">钟宝琴 <i class="fz-resume fz-female"></i></h2>
    <div class="info-labels">
      <p class="row-base">
        <span class="label-text"><i class="fz-resume fz-experience"></i>12年工作经验</span>
        <em class="vline"></em>
        <span class="label-text"><i class="fz-resume fz-degree"></i>大专学历</span>
        <em class="vline"></em>
        <span class="label-text"><i class="fz-resume fz-status"></i>已离职</span>
      </p>
      <p class="row-contact">
        <span class="label-text"><i class="fz-resume fz-tel"></i>15295554294</span>
        <em class="vline"></em>
        <span class="label-text span-wechat"><i class="fz-resume fz-email"></i>785589863@qq.com</span>
      </p>
    </div>
  </div>
  
  <!--专业技能-->
  <div class="resume-item resume-ability">
    <h3 class="title">专业技能</h3>
    <div class="text">
      <p>
      1.理解Web标准，熟练运用html标签，掌握html5如localstorage新特性。<br />
      2.熟练运用css及css3新属性，注重浏览器兼容性，熟悉常见的css hack，掌握bootstrap框架的使用，掌握css预编译器Less。<br />
      3.掌握jQuery，掌握原生JS的编程，注重JavaScript性能优化，会常用的es6语法。<br />
      4.熟练运用Photoshop、Sublime text、Chrome、git svn等常用工具。<br />
      5.熟练使用webpack/gulp，进行自动化构建项目。<br />
      6.熟练使用vue+vant进行公众号h5页面开发。<br />
      7.熟练使用vue+element-ui，进行管理后台项目开发。<br />
      8.熟练使用uni-app进行跨平台（小程序, h5, app）项目开发。<br />
      9.会使用react+dva+ant-design，进行项目开发。<br />
      </p>
    </div>
  </div>
  <!--我的优势-->
  <div class="resume-item resume-summary">
    <h3 class="title">我的优势</h3>
    <div class="text">
      <p>
      具备pc和手机端，前端开发能力。有较好的团队合作，交流能力。能很好地配合产品／设计/交互，完成新需求的开发任务。善于快速学习并使用新技术。对工作和新知识充满热情，熟悉webpack和gulp的用法，常用vue进行项目的开发，会常用的es6语法，用nodejs写过小工具。
      </p>
    </div>
  </div>
  <!--求职意向-->
  <div class="resume-item resume-purpose">
    <h3 class="title">求职意向</h3>
    <div class="info-labels">
      <span class="label-text"><i class="fz-resume fz-job"></i>web前端</span>
      <em class="vline"></em>
      <span class="label-text"><i class="fz-resume fz-salary"></i>20k-23k</span>
      <em class="vline"></em>
      <span class="label-text"><i class="fz-resume fz-place"></i>南京</span>
    </div>
  </div>
  <!--工作经历-->
  <div class="resume-item resume-history">
    <h3 class="title">工作经历</h3>
    <div class="history-project">
      <!--浙江万橙软件有限公司-->
      <div class="history-item">
        <span class="period">2018.10-2020.02</span>
        <h4 class="name">浙江万橙软件有限公司</h4>
        <div class="text">
          <h4>研发<em class="vline"></em>前端开发工程师</h4>
          <div class="text">
            <h4>工作内容</h4>
            <p>
              1、如意智能公众号h5页面的开发，小程序的开发，后台管理端开发；<br>
              2、汇脉云公众号h5页面的开发，小程序的开发，app的开发，管理后台开发，代理后台开发；主要用的vue + uni-app + vant + element-ui；<br>
              3、汇脉云各定制版本的开发；<br>
              4、抖爸爸小程序的开发；<br />
              5、抖商眼管理后台功能开发
            </p>
          </div>
        </div>
        <div class="text">
          <h4>
           <span>VUE</span>
           <span>小程序</span>
           <span>UNI-APP</span>
          </h4>
        </div>
      </div>
      <!--金买卖（北京）科技有限公司江苏分公司-->
      <div class="history-item">
        <span class="period">2017.06-2018.10</span>
        <h4 class="name">金买卖（北京）科技有限公司</h4>
        <div class="text">
          <h4>研发<em class="vline"></em>前端开发工程师</h4>
          <div class="text">
            <h4>工作内容</h4>
            <p>
              1、金买卖后台管理系统前端框架搭建及开发；<br>
              2、金买卖公众号h5开发，及嵌在app中的页面开发；<br>
            </p>
          </div>
        </div>
        <div class="text">
          <h4>
           <span>VUE</span>
           <span>小程序</span>
           <span>zepto</span>
          </h4>
        </div>
      </div>
      <!--江苏钱旺信息产业控股集团-->
      <div class="history-item">
        <span class="period">2016.04-2017.06</span>
        <h4 class="name">江苏钱旺信息产业控股集团</h4>
        <div class="text">
          <h4>研发<em class="vline"></em>前端开发工程师</h4>
          <div class="text">
            <h4>工作内容</h4>
            <p>
              1、雷拍，无人机，莱慕朶，宝购等项目的pc和wap站点的前端开发；<br>
              2、前端公共组件的开发和维护；<br>
              3、新技术的研究，并在项目中实施，如用react+antd-design+dva开发，无人机的ba后台管理系统，cms管理系统；<br>
              4、页面的性能优化和代码重构。
            </p>
          </div>
        </div>
        <div class="text">
          <h4>
           <span>HTML/CSS</span>
           <span>react</span>
           <span>JS</span>
          </h4>
        </div>
      </div>
      <!--金智教育-->
      <div class="history-item">
        <span class="period">2014.06-2016.04</span>
        <h4 class="name">金智教育</h4>
        <div class="text">
          <h4>研发<em class="vline"></em>前端开发工程师</h4>
          <div class="text">
            <h4>工作内容</h4>
            <p>
              1.前端公共组件的开发和维护；<br>
              2.典型场景页面的静态和交互实现；<br>
              3.应用平台，学工系统，人事系统的前端开发；<br>4.Lovey组件开发，换肤工具，组件自动化打包工具用nodejs开发
            </p>
          </div>
        </div>
        <div class="text">
          <h4>
           <span>HTML/CSS</span>
           <span>前端开发</span>
           <span>JS</span>
          </h4>
        </div>
      </div>
      <!--上海易宝南京分公司-->
      <div class="history-item">
        <span class="period">2010.10-2014.06</span>
        <h4 class="name">上海易宝南京分公司</h4>
        <div class="text">
          <h4>研发<em class="vline"></em>前端开发工程师</h4>
          <div class="text">
            <h4>工作内容</h4>
            <p>
              1.参与公司与华为合作的IPTV项目 EPG部件 Flash和js多个版本设计和开发电子相框的静态页面，样式表和js编写;<br>
              2.能力开放平台项目，运营商门户多个模块的设计和开发;<br>
              3.与交通银行合作的文档写作系统多个模块的设计和开发;<br>
              4.AAA的BUS小组，多个版本功能点的设计和开发.
            </p>
          </div>
        </div>
        <div class="text">
          <h4>
           <span>HTML/CSS</span>
           <span>前端开发</span>
           <span>JS</span>
          </h4>
        </div>
      </div>
      <!--南京甘霖科技有限公司-->
      <div class="history-item">
        <span class="period">2009.07-2010.10</span>
        <h4 class="name">南京甘霖科技有限公司</h4>
        <div class="text">
          <h4>研发<em class="vline"></em>前端开发工程师</h4>
          <div class="text">
            <h4>工作内容</h4>
            <p>
              1.负责公司网站的开发，页面设计，服务器维护，软件界面设计，软件定制开发及维护；<br>
              2.静态制作，调IE6,7,8及FF的浏览器兼容性；<br>
              3.宣传页的制作。
            </p>
          </div>
        </div>
        <div class="text">
          <h4>
           <span>HTML/CSS</span>
           <span>前端开发</span>
           <span>JS</span>
          </h4>
        </div>
      </div>
      <!--上海欧加华-->
      <div class="history-item">
        <span class="period">2008.04-2009.07</span>
        <h4 class="name">上海欧加华</h4>
        <div class="text">
          <h4>研发<em class="vline"></em>前端开发工程师</h4>
          <div class="text">
            <h4>工作内容</h4>
            <p>
              1.参与公司研发的影像工作站软件的软件测试及界面设计；<br>
              2.公司中英文网站的开发和管理，主要负责页面设计及后台管理；<br>
              3.OA系统的页面设计。
            </p>
          </div>
        </div>
        <div class="text">
          <h4>
           <span>HTML/CSS</span>
           <span>前端开发</span>
           <span>JS</span>
          </h4>
        </div>
      </div>
  </div>
  <!--教育经历-->
  <div class="resume-item resume-education">
    <h3 class="title">教育经历</h3>
    <div class="history-education">
      <div class="history-item">
        <span class="period">2005-2008</span>
        <h4 class="name">江西理工大学南昌校区</h4>
        <div class="text">
          <h4>计算机系统维护<em class="vline"></em>大专</h4>
        </div>
      </div>
    </div>
  </div>

</div>
</body>
</html>